import React from 'react'
import './Header.scss'
import { NavLink, useNavigate } from "react-router-dom";
import { RubyOutlined, BlockOutlined } from '@ant-design/icons';
import Loginab from '../../components/Loginab/Index';
import HeadeInput from '../HeadeInput/index'
const Index: React.FC = () => {
    const navigate = useNavigate()
    const handelOrderInvoice = () => {
        navigate('/orderInvoice/gBRecharge')
    }
    return (
        <div className='headerbox'>
            <div className="Header-Left">
                <img className="Header-img"
                    src="https://img2.baidu.com/it/u=2834985837,4012048101&fm=253&fmt=auto&app=120&f=JPEG?w=597&h=176"
                    alt=""
                />
            </div>
            <div className="headercen">
                <NavLink to={"/"}>首页</NavLink>
                <NavLink to={"/makerpost"}>创客贴AI</NavLink>
                <NavLink to={"/enterpriseDesignServices"}>企业设计服务</NavLink>
                <NavLink to={"/printProduction"}>印刷制作</NavLink>
                <NavLink to={"/downloadApp"}>下载App</NavLink>
            </div>
            <button className="VIPBtn">
                <RubyOutlined />VIP会员
            </button>
            <button className="qiyeBtn">
                <NavLink to={"/corporate"} style={{ textDecoration: 'none', color: "#0773fc" }}><BlockOutlined />企业服务</NavLink>
            </button>
            <button className="DFBtn" onClick={handelOrderInvoice}>
                <BlockOutlined />订单/发票
            </button>
            <Loginab></Loginab>

            {/* <Outlet></Outlet> */}
            <HeadeInput></HeadeInput>
        </div>
    )
}

export default Index